<template>
        <div class="company-form" style="">
            <ul class="ul-list whitebg">
                <li>
                    <a href="javascript:void(0);" class="content">
                        <span class="ul-list-tit pull-left"><b>*</b>公司全称</span>
                        <div class="con input-box">
                            <input id="company_name" v-model="company.companyName" type="text" maxlength="40" placeholder="请输入公司全称":readonly="readonlyFlag">
                        </div>
                    </a>
                </li>
                <li>
                    <a href="javascript:void(0);" class="content arr-rt">
                        <span class="ul-list-tit pull-left"><b>*</b>所在省份</span>
                        <div class="con input-box">
                            <select class="md-select" dir="rtl" v-on:change="initCity" v-model="company.province"readonly :disabled="readonlyFlag" style="color: black;">
                                <option value="">请选择</option>
                                <option :value="item.id" v-for="item in provinceList" >{{item.name}}</option>
                            </select>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="javascript:void(0);" class="content arr-rt">
                        <span class="ul-list-tit pull-left"><b>*</b>所在城市</span>
                        <div class="con input-box">
                            <select class="md-select" dir="rtl" v-model="company.city" readonly :disabled="readonlyFlag" style="color: black;">
                                <option value="">请选择</option>
                                <option :value="item.id" v-for="item in cityList" >{{item.name}}</option>
                            </select>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="javascript:void(0);" class="content">
                        <span class="ul-list-tit pull-left"><b>*</b>详细地址</span>
                        <div class="con input-box">
                            <input id="address" v-model="company.address"type="text" maxlength="40" placeholder="请输入详细地址":readonly="readonlyFlag">
                        </div>
                    </a>
                </li>
                <li>
                    <a href="javascript:void(0);" class="content">
                        <span class="ul-list-tit pull-left"><b>*</b>负责人姓名</span>
                        <div class="con input-box">
                            <input id="name" type="text"v-model="company.chargeMan" maxlength="10" placeholder="请输入负责人姓名":readonly="readonlyFlag">
                        </div>
                    </a>
                </li>
                <li>
                    <a href="javascript:void(0);" class="content">
                        <span class="ul-list-tit pull-left"><b>*</b>手机号码</span>
                        <div class="con input-box">
                            <input type="number" maxlength="13"v-model="company.phone"  placeholder="请输入负责人电话" id="company_tel":readonly="readonlyFlag">
                        </div>
                    </a>
                </li>
            </ul>
            <p v-if="isShow&&!editFlag"class="submit-p content" @click="submitCompany"><a href="javascript:void(0);" class="js_logout blind-btn">提交</a></p>
            <p v-if="isShow&&editFlag"class="submit-p content" @click="editCompany"><a href="javascript:void(0);" class="js_logout blind-btn">提交</a></p>
        </div>
</template>
<script>
	export default{
		data(){
			return {
				provinceList:[],
				cityList:[],
				isShow:true,
				readonlyFlag:false,
				editFlag:false,
				company:{
					province:"",
					provinceId:"",
					city:"",
					cityId:"",
					companyName:"",
					address:"",
					chargeMan:"",
					phone:"",
					domainURL:"",
					status:"",
					id:"",
					userId:window.localStorage.getItem("3_userId")
				}
			}
		},
		mounted:function() {
		//	this.initProvince();
			this.loadCompany();
		},
//		watch:{
//			"company.province":function(val,oldVal){
//				this.initCity(val);
//			}
//		},
		methods:{
			validate:function(){
				var _self = this;
				if(!_self.company.companyName){
					layer.msg("公司全称不能为空");
					return false;
				}
				if(!_self.company.province){
					layer.msg("所在省份不能为空");
					return false;
				}
				if(!_self.company.city){
					layer.msg("公司城市不能为空");
					return false;
				}  
				if(!_self.company.address){
					layer.msg("详细地址不能为空");
					return false;
				} 
				if(!_self.company.chargeMan){
					layer.msg("负责人姓名不能为空");
					return false;
				}
				if(!_self.company.phone){
					layer.msg("手机号码不能为空");
					return false;
				}
				return true;
			},
			initProvince:function(){
				var _self = this;
				var body = {};
				body.params = {};
				var url = this.utilHelper.apiUrl+'/api/getProvince';
				_self.$http.post(url,body).then((response)=>{
					var body = response.body
					if(body.result==1){
						_self.provinceList = body.resData.areaList;
						if(_self.company.provinceId) {
							_self.company.province = _self.company.provinceId;
							_self.initCity();
						}
					}
				})
			},
			initCity:function(){
				var _self = this;
				var province = "";
				if(_self.company.province){
					province=_self.company.province;
				}
				var body = {};
				body.params = {
						areaId:province
					}
				var url = this.utilHelper.apiUrl+'/api/getCity';
				_self.$http.post(url,body).then((response)=>{
					var body = response.body
					if(body.result==1){
						_self.cityList = body.resData.areaList;
						_self.company.city = _self.company.cityId;
					}
				})
			},
			submitCompany:function(){
				var _self = this;
				if(_self.validate()){
					_self.isShow = false;//将提交按钮隐藏
				var body  = {};
				body.params = {
					companyName : _self.company.companyName,
					province : _self.company.province,
					city : _self.company.city,
					address : _self.company.address,
					chargeMan : _self.company.chargeMan,
					phone : _self.company.phone
				};
				var url = this.utilHelper.apiUrl+'/api/addAgentOrg';
				_self.$http.post(url,body).then((response)=>{
					var body = response.body
					if(body.result==1){
                        _self.getPartnerInfo();
						layer.msg("操作成功!");
						_self.$router.replace({path:'My'});
					}else{
						_self.isShow = true;
						layer.msg(body.resData.resultMsg);
					}
				})
				}
			},
			loadCompany:function(){
				//加载公司信息
				var _self = this;
				var body = {};
				body.params = {};
				var url = this.utilHelper.apiUrl+'/api/getCompanyByUserId';
				_self.$http.post(url,body).then((response)=>{
					var data = response.body.resData;
					if(data.result==1){
						var company = data.company;
						var companyType = company.companyType;
						var userRole = window.localStorage.getItem("3_userRole");
						var status =  company.status;
						if(companyType != '20') {
							if(company.id){
							_self.company.cityId = company.city;
							_self.company.city = company.city;
							_self.company.id = company.id;
							_self.company.province = company.province;
							_self.company.provinceId = company.province;
							_self.company.companyName = company.companyName;
							_self.company.address = company.adress;
							_self.company.chargeMan = company.chargeMan;
							_self.company.phone = company.phone;
							_self.company.status = company.status;
						}
						//当公司已审核通过时，隐藏提交按钮
						if(_self.company.status=="2"){
							_self.isShow=false;
							_self.readonlyFlag = true;
						}
						if(_self.company.id){
							_self.editFlag = true;
						}
						}
						
					}
					_self.initProvince();
				})
			},
			editCompany:function(){
				var _self = this;
				if(_self.validate()){
					_self.isShow = false;//将提交按钮隐藏
					var body = {};
					body.params = {
						companyId : _self.company.id,
						companyName : _self.company.companyName,
						province : _self.company.province,
						city : _self.company.city,
						address : _self.company.address,
						chargeMan : _self.company.chargeMan,
						phone : _self.company.phone
					};
					var url = this.utilHelper.apiUrl+'/api/updateAgentOrg';
					_self.$http.post(url,body).then((response)=>{
						var data = response.body.resData;
						if(data.result==1){
							layer.msg("操作成功!");
							_self.$router.replace({path:'My'});
						}else{
							_self.isShow = true;
							layer.msg(data.resultMsg);
						}
					})
				}
			},
            //实时获取用户信息
            getPartnerInfo(){
		        var _self = this;
		        var body = {};
		        body.params = {}
		        var url = this.utilHelper.apiUrl+'/api/getUserById';
		          _self.$http.post(url, body).then((response) => {
		              var data = response.body.resData;
		              var result = data.result;
		              if (result == "1") {
		                window.localStorage.setItem("3_userId", data.id);
                        window.localStorage.setItem("3_userName", data.accountName);
                        window.localStorage.setItem("3_phone", data.phone);
                        window.localStorage.setItem("3_isLogin", true);
                        window.localStorage.setItem("3_userRole", data.userRoleId);
                        window.localStorage.setItem("3_accountType",data.accountType);
		              }
		          });
		    }
			
		}
	}
	
</script>
<style scoped>
	@import url("../../assets/css/global.css");
	@import url("../../assets/css/style.css");
		input, textarea, img {
    vertical-align: middle;
	    font-family: Arial, "Microsoft Yahei";
	}
	input, textarea {
	    outline: none;
	}
	input, textarea, button {
	    -webkit-appearance: none;
	}
	input, textarea, button {
	    -webkit-appearance: none;
	}
</style>